import React, {Component,} from 'react'
import {BrowserRouter, Route, Switch} from 'react-router-dom'
import Home from './Demo/Home'
import RefDemo from './Demo/RefDemo'
import ForwardRefDemo from './Demo/ForwardRefDemo'
import Context from './Demo/Context'
import SuspenseDemo from './Demo/SuspenseDemo'
import HooksDemo from './Demo/HooksDemo'

export default class Router extends Component {
    render() {
        return <BrowserRouter>
            <Switch>
                <Route to={'/'} render={() => (
                    <Home>
                        <Switch>
                            <Route exact path={'/ref'} component={RefDemo}/>
                            <Route exact path={'/forwardRef'} component={ForwardRefDemo}/>
                            <Route exact path={'/context'} component={Context}/>
                            <Route exact path={'/suspense'} component={SuspenseDemo}/>
                            <Route exact path={'/hooks'} component={HooksDemo}/>
                        </Switch>
                    </Home>
                )
                }/>
            </Switch>
        </BrowserRouter>
    }
}